<%@ page language="java" contentType="text/html; UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
    <style type="text/css">
        body{
            width: 100%;
            height: 100%;
        }
        .out{
            width:100%;
            height:800px;
        }
        .top{
            margin-left:10%;
        }
        .top div{
            margin-left:20px;
            float: left;
        }
        table{
            margin:auto;
            margin-top:20px;
        }
        .bottom{
            margin:auto;
            margin-left:40%;
            margin-top:50px;
        }
        .bottom input{
            width:40px;
            margin-left:30px;
            margin-right:30px;
        }
        .select{
            margin-left: 150px;
        }
        .add{
            margin-left:30px;
       }
    </style>
</head>
<body>
    <div class="out">
    <div class="top"> 
        <div class="name">
            <span>员工姓名</span>
            <input type="text" name="employee.e_name" class="employee_name"/>
        </div>
        <div class="sex">
            <span>性别</span>
            <select name="employee.e_sex" class="employee_sex">
              <option></option>
              <option value="1">男</option>
              <option value="0">女</option>
            </select>
        </div>
        <div class="department">
            <span>工作部门</span>
            <select name="employee.d_id" class="employee_id">
              <option></option>
              <option value="1">1</option>
              <option value="2">2</option>
            </select>
        </div>
        <button class="select" onclick="submit(3)">搜索</button>
        <button class="add">添加</button>
    </div>
    <div class="table">
    <!-- <table border="1">
       <tr>
           <th>员工姓名</th>
           <th>性别</th>
           <th>身份证号</th>
           <th>工作部门</th>
           <th>个人电话</th>
           <th>备注</th>
           <th>操作</th>
       </tr>
   <c:forEach items="${pageInfo.datas}" var="employee" >
       <tr>
           <td class="name">${employee.e_name}</td>
           <td class="sex">${employee.e_sex}</td>
           <td class="card_number">${employee.card_number}</td>
           <td class="d_name">${employee.departement.d_name}</td>
           <td class="tel">${employee.tel}</td>
           <td class="note">${employee.note}</td>
           <td><div onclick="detail(${employee.e_id})">详细情况</div></td>
       </tr>
       </c:forEach>
   </table>
   </div>
    <div class="bottom">
     <button onclick="decrease(${pageInfo.currentPage})">上一页</button>
        <div class="currentpage">${pageInfo.currentPage}</div>
       <button onclick="add(${pageInfo.currentPage})">下一页</button>
      
       <button onclick="submit(0)">上一页</button>
        <div class="currentpage">${pageInfo.currentPage}</div>
       <button onclick="submit(1)">下一页</button>
    </div>
     -->
    </div>
</body>
<script type="text/javascript" src="../JS/jquery.1.9.1.js"></script>
<script>
function submit(a){
	var name=$(".employee_name").val();
	var sex=$(".employee_sex").val();
	var id=$(".employee_id").val();
	var currentPage = $(".currentpage").html();
	if(a==1){
	    currentPage++;	
	}else if(a==0){
		currentPage--;
	}
	$(".table").empty();
	$.ajax({
	   type:"post",
	   url :"../employeeShow.action",
	   data:{
			  "employee.e_name":name,
			  "employee.e_sex":sex,
			  "employee.d_id":id,
		  currentPage:currentPage,		   
	   },
	   dataType:"html",
	   success:function(data){
		   alert(data);
		   $($.parseHTML(data, document, true)).appendTo($(".table"));       
	   },
	   error:function(){
		   alert("失败");
	   }
	});	
}
submit(3);
function detail(a){
	   alert(234);
	   window.location.href="employeeDetail.action?e_id="+a;
	}
</script>
</html>